/**
 * Created by zhangsong on 2019/9/24.
 */
import React, { Component } from 'react';
import { Button, Modal, Spin } from 'antd';
import { FormattedMessage, formatMessage } from '@/utils/i18n';
import { pdfjs } from 'react-pdf';
import PDF from './pdf';

pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/legacy/build/pdf.worker.min.js`;
export default class PDFComponent extends Component {
  handleOk() {
    const { onOk } = this.props;
    if (typeof onOk === 'function') {
      onOk();
    }
  }

  handleCancel() {
    const { onCancel } = this.props;
    if (typeof onCancel === 'function') {
      onCancel();
    }
  }

  render() {
    const { visible = false, url = [], loading = false, printing = false } = this.props;
    let html = null;

    if (Array.isArray(url) && url.length > 0) {
      console.log('看看这个pdf的url', url);
      html = url.map((item, index) => (
        // eslint-disable-next-line react/no-array-index-key
        <PDF key={index} url={item} printing={printing} />
      ));
    } else if (typeof url === 'string') {
      html = <PDF url={url} printing={printing} />;
    } else {
      html = loading ? null : <FormattedMessage id="baseInfo.notFoundPdf" />;
    }
    return (
      <div>
        <Modal
          title={formatMessage('baseInfo.previewPDF')}
          closable={false}
          visible={visible}
          onOk={() => this.handleOk()}
          destroyOnClose
          onCancel={() => this.handleCancel()}
          footer={
            <Button type="primary" htmlType="button" onClick={() => this.handleOk()}>
              <FormattedMessage id="button.close" />
            </Button>
          }
        >
          <Spin spinning={loading}>{html}</Spin>
        </Modal>
      </div>
    );
  }
}
